.block.b_subscribe-banner
{
	display: flex;
	flex-direction: column;
	width: 100%;
	justify-content: center;
	align-items: flex-start;
	position: relative;
	order: 0;

	.top
	{
		overflow: clip;
		background: linear-gradient(rgba(151, 151, 151, 1) 0%, rgba(95, 95, 95, 1) 100%);
		position: relative;
		flex: 0 0 3px;
		width: 100%;
		order: 0;
	}

	.middle
	{
		display: flex;
		flex-direction: column;
		padding: 30px 60px;
		align-items: flex-start;
		gap: 30px;
		overflow: clip;
		background: linear-gradient(rgba(223, 223, 223, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(223, 223, 223, 1) 100%);
		position: relative;
		flex: 0 0 auto;
		width: 100%;
		order: 1;
	}

	.text-and-icon
	{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		gap: 30px;
		position: relative;
		flex: 0 0 244px;
		width: 100%;
		order: 0;
	}

	.icon-megaphone
	{
		width: 69px;
		position: relative;
		flex: 0 0 70px;
		object-fit: cover;
		order: 0;
	}

	.text-1
	{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
		gap: 10px;
		position: relative;
		flex: 0 0 144px;
		width: 100%;
		order: 1;
	}

	.title
	{
		flex: 1 1 0%;
		display: flex;
		flex-direction: column;
		color: var(--Neutrals-Black, #000);
		font-family: blinker;
		font-style: normal;
		font-size: 32px;
		font-weight: 400;
		line-height: 36px /* 113% */;
		position: relative;
		min-height: 0;
		width: 100%;
		order: 0;
	}

	.description
	{
		flex: 1 1 0%;
		display: flex;
		flex-direction: column;
		color: var(--Neutrals-Deep-Gray, #363636);
		font-family: blinker;
		font-style: normal;
		font-size: 22px;
		font-weight: 400;
		line-height: 26px /* 118% */;
		position: relative;
		min-height: 0;
		width: 100%;
		order: 1;
	}

	.subscribe-link
	{
		text-decoration: none;
		color: inherit;
		display: flex;
		align-items: center;
		position: relative;
		flex: 0 0 auto;
		flex-direction: row;
		order: 1;
	}

	.content
	{
		display: flex;
		padding: 10px 6px 10px 30px;
		justify-content: center;
		align-items: center;
		gap: 2px;
		background: var(--Colors-Neutrals-Black, #000000);
		position: relative;
		flex: 0 0 auto;
		flex-direction: row;
		order: 0;
	}

	.example-cta
	{
		color: var(--Neutrals-White, #FFF);
		font-family: "instrument sans";
		font-style: normal;
		font-size: 18px;
		font-weight: 600;
		line-height: 20px /* 111% */;
		position: relative;
		flex: 0 0 auto;
		order: 0;
	}

	badge-icon.badge-icon
	{
		display: flex;
		flex-direction: column;
		height: 30px;
		padding: 10px;
		justify-content: center;
		align-items: center;
		overflow: clip;
		position: relative;
		flex: 0 0 30px;
		order: 1;

		.icon-arrow-right
		{
			width: 10px;
			overflow: clip;
			position: relative;
			flex: 0 0 17px;
			object-fit: cover;
			order: 0;
		}

		.icon-arrow-right.hover
		{
			display: none;
		}
	}

	badge-icon[data-icon="lightbulb"]
	{
		flex-shrink: initial;
	}

	badge-icon[data-icon="team"]
	{
		flex-shrink: initial;
	}

	badge-icon[data-icon="stories"]
	{
		flex-shrink: initial;
	}

	badge-icon[data-icon="arrow right"]
	{
		flex-shrink: initial;
	}

	badge-icon[data-icon="dollar sign"] .icon-arrow-right
	{
		display: none;
	}

	badge-icon[data-icon="lightbulb"] .icon-arrow-right
	{
		display: none;
	}

	badge-icon[data-icon="team"] .icon-arrow-right
	{
		display: none;
	}

	badge-icon[data-icon="stories"] .icon-arrow-right
	{
		display: none;
	}

	.endcap
	{
		position: relative;
		flex: 0 0 12px;
		object-fit: cover;
		order: 1;
	}

	.endcap.hover
	{
		display: none;
	}

	.subscribe-link:hover
	{
		box-shadow: 0 4px 0 0 var(--Neutrals-Light-Gray, #DFDFDF);

		.content
		{
			background: var(--Brand-Red, #DF1F36);

			.badge-icon
			{

				.icon-arrow-right
				{
					display: none;
				}

				.icon-arrow-right.hover
				{
					display: block;
				}
			}
		}

		.endcap
		{
			display: none;
		}

		.endcap.hover
		{
			display: block;
		}
	}

	.bottom
	{
		overflow: clip;
		background: linear-gradient(rgba(151, 151, 151, 1) 0%, rgba(95, 95, 95, 1) 100%);
		position: relative;
		flex: 0 0 3px;
		width: 100%;
		order: 2;
	}

	.modal 
	{
		display: none;
		
		&.active 
		{
			display: flex;
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			padding: 20px;
			background-color: rgba(0, 0, 0, 0.55);
			justify-content: center;
			align-items: center;
			z-index: 9999;

			.modal-content 
			{
				position: relative;
				overflow: auto;
				max-height: 100%;
				width: min(1080px, 100%);
				padding: 106px 90px 84px;
				background: var(--Neutrals-Off-White, #f6f6f6);
				border-radius: 0;

				.close-button
				{
					position: absolute;
					top: 21px;
					right: 21px;
					width: 43px;
					height: 43px;
					display: flex;
					align-items: center;
					justify-content: center;
					cursor: pointer;
					z-index: 2;

					img
					{
						display: none;
					}

					&::before,
					&::after
					{
						content: "";
						position: absolute;
						top: 50%;
						left: 50%;
						width: 42px;
						height: 1.5px;
						background: var(--Brand-Red, #df1f36);
						transform-origin: center;
					}

					&::before
					{
						transform: translate(-50%, -50%) rotate(45deg);
					}

					&::after
					{
						transform: translate(-50%, -50%) rotate(-45deg);
					}
				}

				.modal-body
				{
					max-width: 100%;

					#gform_wrapper_3
					{
						margin: 0;
					}

					#gform_3
					{
						position: relative;
					}

					#gform_fields_3
					{
						display: flex;
						flex-direction: column;
						gap: 34px;
					}

					#field_3_2
					{
						display: flex;
						flex-direction: column;
						align-items: center;
						gap: 18px;
						margin: 0;

						&::before
						{
							content: "";
							width: 122px;
							height: 122px;
							background: url('/wp-content/acftb-content/acftb-blocks/_images/icon-megaphone.svg') center/contain no-repeat;
						}

						h2 
						{
							margin: 0;
							color: var(--Neutrals-Black, #000);
							font-family: blinker;
							font-size: 48px;
							font-style: normal;
							font-weight: 400;
							line-height: 52px;
							text-align: center;
						}

						h5
						{
							margin: 0;
							color: var(--Neutrals-Deep-Gray, #363636);
							font-family: blinker;
							font-size: 26px;
							font-style: normal;
							font-weight: 400;
							line-height: 30px;
							text-align: center;
						}

						&::after
						{
							content: 'Asterisks* indicate required fields';
							display: block;
							margin-top: 22px;
							color: var(--Neutrals-Gray, #818181);
							font-family: 'instrument sans';
							font-size: 14px;
							font-style: italic;
							font-weight: 500;
							line-height: 20px;
							letter-spacing: 0.28px;
							text-align: center;
						}
					}

					.gfield_label,
					.hidden_sub_label,
					.screen-reader-text,
					legend
					{
						display: none !important;
					}

					#field_3_3,
					#field_3_1
					{
						margin: 0;
					}

					#field_3_3,
					#field_3_6,
					#field_3_7,
					#gform_fields_3 fieldset
					{
						border: 0;
						padding: 0;
						min-inline-size: 0;
					}

					#field_3_3 .ginput_complex,
					#field_3_1 .ginput_container_email
					{
						display: grid;
						grid-template-columns: repeat(2, minmax(0, 1fr));
						gap: 28px;
					}

					#field_3_1 .ginput_container_email
					{
						grid-template-columns: minmax(0, 1fr);
					}

					#field_3_3 .ginput_complex > span,
					#field_3_1 .ginput_container_email
					{
						position: relative;
					}

					#field_3_3 input,
					#field_3_1 input
					{
						height: 56px;
						width: 100%;
						padding: 18px 14px;
						border-radius: 4px;
						border: 2px solid var(--Neutrals-Light-Gray, #dfdfdf);
						background: transparent;
						color: var(--Neutrals-Deep-Gray, #363636);
						font-family: 'instrument sans';
						font-size: 16px;
						font-style: normal;
						font-weight: 500;
						line-height: 14px;
					}

					#field_3_3 input::placeholder,
					#field_3_1 input::placeholder
					{
						color: var(--Neutrals-Gray, #818181);
						opacity: 1;
					}

					#field_3_1 .gfield_description
					{
						margin-top: 10px;
						color: var(--Neutrals-Gray, #818181);
						font-family: 'instrument sans';
						font-size: 14px;
						font-style: italic;
						font-weight: 500;
						line-height: 20px;
						letter-spacing: 0.28px;
						text-align: center;
					}

					#field_3_1 .gfield_description a
					{
						color: inherit;
					}

					#field_3_4
					{
						margin: 10px 0 0;
						text-align: center;

						h5
						{
							margin: 0;
							color: var(--Neutrals-Deep-Gray, #363636);
							font-family: blinker;
							font-size: 26px;
							font-style: normal;
							font-weight: 400;
							line-height: 30px;
						}

						p
						{
							margin: 10px 0 0;
							color: var(--Neutrals-Gray, #818181);
							font-family: 'instrument sans';
							font-size: 14px;
							font-style: italic;
							font-weight: 500;
							line-height: 20px;
							letter-spacing: 0.28px;
						}
					}

					#field_3_6
					{
						margin: 6px 0 0;

						.gfield_checkbox
						{
							display: flex;
							justify-content: center;
							align-items: center;
							gap: 50px;
							column-gap: 42px;
							row-gap: 22px;
							flex-wrap: wrap;
						}

						.gchoice
						{
							display: flex;
							align-items: center;
							gap: 16px;
							margin: 0;
						}

						.gfield-choice-input
						{
							appearance: none;
							width: 40px;
							height: 40px;
							border-radius: 4px;
							border: 2px solid var(--Neutrals-Light-Gray, #dfdfdf);
							background: transparent;
							margin: 0;
							cursor: pointer;
						}

						.gfield-choice-input:checked
						{
							background: linear-gradient(var(--Brand-Red, #df1f36), var(--Brand-Red, #df1f36));
							background-size: 20px 20px;
							background-position: center;
							background-repeat: no-repeat;
						}

						.gform-field-label--type-inline
						{
							color: var(--Neutrals-Deep-Gray, #363636);
							font-family: blinker;
							font-size: 22px;
							font-style: normal;
							font-weight: 400;
							line-height: 26px;
						}
					}

					#field_3_7
					{
						margin: -2px 0 0;

						.ginput_container_consent
						{
							display: flex;
							gap: 16px;
							align-items: flex-start;
						}

						#input_3_7_1
						{
							appearance: none;
							width: 40px;
							height: 40px;
							flex: 0 0 40px;
							border-radius: 4px;
							border: 2px solid var(--Neutrals-Light-Gray, #dfdfdf);
							background: transparent;
							margin: 0;
							cursor: pointer;
						}

						#input_3_7_1:checked
						{
							background: linear-gradient(var(--Brand-Red, #df1f36), var(--Brand-Red, #df1f36));
							background-size: 20px 20px;
							background-position: center;
							background-repeat: no-repeat;
						}

						.gfield_consent_label
						{
							color: var(--Neutrals-Deep-Gray, #363636);
							font-family: 'instrument sans';
							font-size: 14px;
							font-style: italic;
							font-weight: 500;
							line-height: 20px;
							letter-spacing: 0.28px;
							max-width: 800px;
						}
					}

					.gform-footer
					{
						margin: 24px 0 0;
						display: flex;
						justify-content: center;
						position: relative;
						width: max-content;
						margin-left: auto;
						margin-right: auto;
						padding: 0;

						&::after
						{
							content: "";
							position: absolute;
							top: 0;
							right: 0;
							width: 12px;
							height: 50px;
							background: url('/wp-content/acftb-content/acftb-blocks/Subscribe Banner/images/endcap.svg') center/cover no-repeat;
							pointer-events: none;
						}

						.gform-loader 
						{
							position: absolute;
							top: 15px;
							right: -30px;
						}
					}

					#gform_submit_button_3
					{
						height: 50px;
						padding: 10px 40px 10px 30px;
						margin-right: 12px;
						appearance: none;
						-webkit-appearance: none;
						border: 0;
						border-radius: 0;
						box-shadow: none;
						color: var(--Neutrals-White, #fff);
						font-family: 'instrument sans';
						font-size: 18px;
						font-style: normal;
						font-weight: 600;
						line-height: 20px;
						background-color: var(--Neutrals-Black, #000);
						background-image: url('/wp-content/acftb-content/acftb-blocks/_images/icon-arrow-right.svg');
						background-repeat: no-repeat;
						background-size: 10px 17px;
						background-position: right 16px center;
						cursor: pointer;
					}

					#gform_submit_button_3:hover
					{
						background-color: var(--Brand-Red, #df1f36);
						background-image: url('/wp-content/acftb-content/acftb-blocks/_images/icon-arrow-right-hover.svg');
					}

					.gform-footer:hover::after
					{
						background-image: url('/wp-content/acftb-content/acftb-blocks/Subscribe Banner/images/endcap-hover.svg');
					}

					.gform_hidden,
					.gform_ajax_spinner,
					.gform-theme-datepicker
					{
						display: none !important;
					}

					.gform_confirmation_message_3
					{
						color: var(--Neutrals-Black, #000);
						font-family: blinker;
						font-size: 48px;
						font-style: normal;
						font-weight: 400;
						line-height: 52px;
						text-align: center;
					}
				}
			}

			@media (max-width: 1200px)
			{
				.modal-content
				{
					padding: 78px 40px 48px;

					.modal-body
					{
						#field_3_2 h2
						{
							font-size: 40px;
							line-height: 44px;
						}

						#field_3_2 h5,
						#field_3_4 h5
						{
							font-size: 24px;
							line-height: 28px;
						}

						#field_3_6 .gfield_checkbox
						{
							gap: 30px;
						}
					}
				}
			}

			@media (max-width: 880px)
			{
				.modal-content
				{
					padding: 64px 20px 36px;

					.close-button
					{
						top: 20px;
						right: 14px;
						width: 30px;
						height: 24px;
					}

					.modal-body
					{
						#gform_fields_3
						{
							gap: 28px;
						}

						#field_3_2
						{
							gap: 12px;

							&::before
							{
								width: 82px;
								height: 82px;
							}

							h2
							{
								font-size: 32px;
								line-height: 36px;
							}

							h5
							{
								font-size: 22px;
								line-height: 26px;
							}
						}

						#field_3_3 .ginput_complex
						{
							grid-template-columns: minmax(0, 1fr);
							gap: 20px;
						}

						#field_3_4 h5
						{
							font-size: 22px;
							line-height: 26px;
						}

						#field_3_6 .gfield_checkbox
						{
							justify-content: flex-start;
							gap: 20px;
						}

						#field_3_6 .gchoice
						{
							width: calc(50% - 10px);
						}

						#field_3_6 .gform-field-label--type-inline
						{
							font-size: 18px;
							line-height: 22px;
						}

						#field_3_7 .ginput_container_consent
						{
							gap: 12px;
						}
					}
				}
			}
		}
	}


	/* Media Query for Desktop */
	@media (min-width: 1440px)
	{
		height: 196px;
		order: 0;

		.top
		{
			order: 0;
		}

		.middle
		{
			padding: 60px;
			justify-content: space-between;
			align-items: center;
			flex-direction: row;
			order: 1;
		}

		.text-and-icon
		{
			height: 70px;
			align-items: center;
			flex: 1 1 0%;
			min-width: 0;
			flex-direction: row;
			order: 0;
		}

		.icon-megaphone
		{
			height: 70px;
			flex: 0 0 69px;
			order: 0;
		}

		.text-1
		{
			height: 65px;
			flex: 1 1 0%;
			min-width: 0;
			order: 1;
		}

		.title
		{
			font-size: 40px;
			line-height: 44px /* 110% */;
			flex: 0 0 auto;
			order: 0;
		}

		.description
		{
			font-size: 26px;
			line-height: 30px /* 115% */;
			flex: 0 0 auto;
			order: 1;
		}

		.subscribe-link
		{
			order: 1;
		}

		.content
		{
			order: 0;
		}

		.example-cta
		{
			order: 0;
		}

		badge-icon.badge-icon
		{
			order: 1;

			.icon-arrow-right
			{
				order: 0;
			}

			.icon-arrow-right.hover
			{
				display: none;
			}
		}

		badge-icon[data-icon="lightbulb"]
		{
			flex-shrink: initial;
		}

		badge-icon[data-icon="team"]
		{
			flex-shrink: initial;
		}

		badge-icon[data-icon="stories"]
		{
			flex-shrink: initial;
		}

		badge-icon[data-icon="arrow right"]
		{
			flex-shrink: initial;
		}

		badge-icon[data-icon="dollar sign"] .icon-arrow-right
		{
			display: none;
		}

		badge-icon[data-icon="lightbulb"] .icon-arrow-right
		{
			display: none;
		}

		badge-icon[data-icon="team"] .icon-arrow-right
		{
			display: none;
		}

		badge-icon[data-icon="stories"] .icon-arrow-right
		{
			display: none;
		}

		.endcap
		{
			order: 1;
		}

		.endcap.hover
		{
			display: none;
		}

		.subscribe-link:hover
		{
			box-shadow: 0 4px 0 0 var(--Neutrals-Light-Gray, #DFDFDF);

			.content
			{
				background: var(--Brand-Red, #DF1F36);

				.badge-icon
				{

					.icon-arrow-right
					{
						display: none;
					}

					.icon-arrow-right.hover
					{
						display: block;
					}
				}
			}

			.endcap
			{
				display: none;
			}

			.endcap.hover
			{
				display: block;
			}
		}

		.bottom
		{
			order: 2;
		}

	}
}